<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
	<link rel='stylesheet' type='text/css' href='../fullcalendar/fullcalendar.css' />
	<link rel='stylesheet' type='text/css' href='../fullcalendar/miniCal.css' />
	<link rel='stylesheet' type='text/css' href='../fullcalendar/fullcalendar.print.css' media='print' />
	
	<script type='text/javascript' src='../jquery/jquery-1.7.1.min.js'></script>
	<script type='text/javascript' src='../jquery/jquery-ui-1.8.17.custom.min.js'></script>
	<script type='text/javascript' src='../fullcalendar/fullcalendar-original.js'></script>
	
	<script type='text/javascript'>

    $(document).ready(function() {
		//get current date
		var date = new Date();
	    var d = date.getDate();
	    var m = date.getMonth();
	    var y = date.getFullYear();
		$('#calendar').fullCalendar({
			theme: false,
			/* ToDo: Remove week and day views when ported to ATutor */
			header: {
				left: 'prev,next today',
				center: 'title',
				right: 'month,agendaWeek,agendaDay'
			},
			/* Events are editable */
			editable: true,	 
			/* ToDo: Replace with fluid tooltip */
			eventMouseover: function(event, jsEvent, view) {
				if (view.name !== 'agendaDay') {
					$(jsEvent.target).attr('title', event.title);
				}
			},
			/* ToDo: Replace with php file */
			events: [
				{
					id: 1,
					title: 'All Day Event',
					start: new Date(y, m, 1),
					end: new Date(y,m,1)
				},
				{
					id: 2,
					title: 'Long Event',
					start: new Date(y, m, d - 5),
					end: new Date(y, m, d - 2)
				},
				{
					id: 3,
					title: 'Repeating Event',
					start: new Date(y, m, d - 3, 16, 0),
					allDay: false
				},
				{
					id: 4,
					title: 'Test Event',
					start: new Date(y, m, d + 4, 16, 0),
					allDay: false
				},
				{
					id: 5,
					title: 'Meeting',
					start: new Date(y, m, 8, 10, 30),
					allDay: false,					
				},
				{
					id: 6,
					title: 'Lunch',
					start: new Date(y, m+2, 9, 12, 0),
					end: new Date(y, m, 9, 23, 30),
					allDay: false,					
				},
				{
					id: 7,
					title: 'Birthday Party',
					start: new Date(y, m, d + 1, 3, 0),
					end: new Date(y, m, d + 1, 4, 0),
					allDay: false,					
				},
				{
					id: 8,
					title: 'Click for Google',
					start: new Date(y, m, 28),
					end: new Date(y, m, 29),				    
				}
			]
		}); 
	});
</script>
<style type='text/css'>
	body {
		margin-top: 40px;
		text-align: center;
		font-size: 14px;
		font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
	}
</style>
</head>

<body>
	<div id='calendar'></div>
</body>
</html>
